@{
    ViewData["Title"] = "Grouping and Summaries In Grid";
}

@section ContentHeader {
    <h1>@ViewData["Title"]<small></small></h1>
}

<div class="alert alert-info alert-dismissable alert-dismissible s-sample-info">
    <button type="button" class="close btn-close" data-dismiss="alert" data-bs-dismiss="alert" aria-hidden="true">&times;</button>
    <p>Here is a demo on grouping and summaries in SlickGrid.</p>
    <p>It starts with no grouping and only grand totals are shown. Click buttons to change grouping options.</p>
    <p>Please note that this is an experimental feature. It has no server side support so these operations are
    performed client side. It only groups by and shows totals for rows in visible page. You have to disable paging to 
    show sums for all records.</p>

    <p class="s-sample-sources"><b>Source Files:</b> @Html.BasicSamplesSourceFile("Index.cshtml"), @Html.BasicSamplesSourceFile("GroupingAndSummariesInGridPage.ts")</p>
</div>

<div id="GridDiv"></div>

@Html.ModulePageInit(ESM.GroupingAndSummariesInGridPage)